 @section('title')
    推荐律团 @parent
@show
@section('content')      
<!-- Top Navbar-->
<div class="navbar theme-white">
	<div class="navbar-inner">
		<div class="left"><a href="{{ route('group.main') }}" class="external icon-only link"> <i class="icon icon-back"></i></a></div>
		<div class="center sliding">{{ $sns_group->group_name }}</div>
		<div class="right">
		@if($sns_group_member)
		<a href="{{ route('group.createpost', $sns_group->id) }}" class="link icon-only">
		@else
		<a href="javascript:void(0);" class="join-ac">
		@endif
		<i class="icon icon-write"></i></a>
		</div>
	</div>
</div>
<div class="pages navbar-through toolbar-fixed">
  <div data-page="group-index-<?php echo $sns_group->id; ?>" class="page pb60">
	<div class="page-content infinite-scroll">
		<div class="group-top">
			<div class="row">
				<div class="col-25"><a href="{{ route('group.detail', $sns_group->id) }}" class="external">@if ($sns_group->group_avatar)
						 <img src="{{ asset($sns_group->group_avatar) }}" width="64" height="64">
						@else
							<img src="{{ asset('/img/group_avatar_index.jpg') }}" width="64" height="64">
						@endif
						</a>
				</div>
				<div class="col-75">
					<div class="group-name">{{ $sns_group->group_name }}</div>
					<div class="group-data">
						<div class="row">
								<div class="col-33">话题 {{ $sns_group->post_count }}</div>
								<div class="col-33">关注 <span id="fans_cnt">{{ $sns_group->fans_cnt }}</span>人</div>
								<div class="col-33">律师 <span id="lawyers_cnt">{{ $sns_group->lawyers_cnt }}</span>人</div>
						</div>
					</div>
					<div class="focus">
					@if($sns_group_member)<span href="javascript:void(0);" class="button button-fill color-green group-btn">&radic; 已关注</span>@else<span href="javascript:void(0);" class="button button-fill color-blue group-btn" id="join-btn">关注</span>@endif
					</div>
				</div>
			</div>
		</div>
		<div class="list-block media-list stories-list list-block-search searchbar-found">
                <?php if(isset($posts) && $posts): ?>
				<?php foreach($posts as $post): ?>
                <div class="card facebook-card">
                <div class="card-header">
                  <div class="facebook-avatar"><a href="{{ route('user.index', $post->creator_id) }}">
									<img class="avatar" src="@if($post->creatorAvatar()){{ Config::get('app.url').'/'.$post->creatorAvatar() }}@else /img/1.png @endif" width="34" height="34">
									</a></div>
                  <div class="facebook-name"><?php echo $post->creatorName(); ?></div>
                  <div class="facebook-date"><?php echo $post->created_at; ?></div>
                </div>
                <div class="card-content">
                  <div class="card-content-inner">
                    <a class="item-content link" data-ignoreCache="true" href="<?php echo URL::route('group.item', array('id' => $post->id)); ?>"><?php echo nl2br($post->content); ?></a>

                    @if($pics && isset($pics[$post->id]))
                    <div class="item-image">
                            <ul class="photo-list">
                                    @foreach($pics[$post->id] AS $pic)
                                    @if(isset($pic['src']))
                                    <li><a href="#" data-id="{{ $post->id }}-{{ $pic['id'] }}" class="dish-img"><img alt="" data-src="{{ Config::get('app.url').'/'.$pic['src'] }}" class="lazy"></a></li>
                                    @endif
                                    @endforeach
                            </ul>
                    </div>
                    @endif
                  </div>
                </div>
                <div class="card-footer lst-card-footer"><!--<a class="link" href="<?php echo URL::route('group.item', array('id' => $post->id)); ?>">点赞({{ $post_extras[$post->id]->likes_count }} )</a>--><a class="item-content link" style="width:100%;" data-ignoreCache="true" href="<?php echo URL::route('group.item', array('id' => $post->id)); ?>">全部评论({{ $post_extras[$post->id]->comments_count}} )</a></div>
              </div>
              @endforeach
              @endif
		</div>
	</div>
	@include('widgets.toolbar', array('active'=>'sns'))
  </div>
</div>
@stop
@section('bodyEnd')
{{ HTML::script('js/image.uploader.js') }}
<script> 
var myPhotoBrowser;
function removeCurrentPhoto(){
	var img_idx = myPhotoBrowser.activeIndex;
	myPhotoBrowser.close();
	var remote_img = $$($$('#perviewList').children('li').eq(img_idx)).children('input').val();
	$$.post("{{ route('group.remove_image') }}",{img:remote_img},function(){});
	$$($$('#perviewList').children('li').eq(img_idx)).remove();
	var picList = [];
	$$('#perviewList li img').each(function(){
		picList.push( $$(this).attr('fullimg') );
	});
	init_photo_browser(picList);
}
function init_photo_browser(picList){
	myPhotoBrowser = myApp.photoBrowser({
	  	photos: picList,
	  	theme: 'dark',
	  	lazyLoading: true,
	  	navbarTemplate: '<div class="navbar"><div class="navbar-inner"><div class="left sliding"><a href="#" class="link close-popup photo-browser-close-link"><i class="icon icon-back"></i><span>关闭</span></a></div><div class="center sliding"><span class="photo-browser-current"></span> <span class="photo-browser-of">of</span> <span class="photo-browser-total"></span></div><div class="right"><a href="javascript:void(0);" onclick="removeCurrentPhoto()" class="button btn-add">删除</a></div></div></div>'
	 });
}

$$(document).on('click', '.dish-img', function(){
	var post_dish_id = $$(this).attr("data-id");
	var dish_id = $$(this).attr("data-id").split('-')[1];
	var photo_list = new Array();
	$$(this).parent().parent().find(".dish-img").each(function(i){
			var img = $$(this).find('img');
			photo = {};
			photo.url = $$(img).attr('src');
			photo.caption = $$(img).attr('alt');
			if(post_dish_id == $$(img).parent().attr('data-id'))
			{
				cur_id =  i;
			}

			photo_list.push(photo);		
	})
	var myPhotoBrowserStandalone = myApp.photoBrowser({
		photos : photo_list,
		navbarTemplate: '<div class="navbar theme-white"><div class="navbar-inner"><div class="left sliding"><a href="#" class="link close-popup photo-browser-close-link"><i class="icon icon-back"></i><span>关闭</span></a></div><div class="center sliding"><span class="photo-browser-current"></span> <span class="photo-browser-of">of</span> <span class="photo-browser-total"></span></div><div class="right"></div></div></div>',
		theme: 'dark',
	});
	myPhotoBrowserStandalone.open(cur_id);
});

@if(Auth::check())
	$$('#join-btn').click(function()
	{
				$$.ajax({
					type: "get",
					dataType: "json",
					url: "{{ route('group.join', $sns_group->id) }}",
					data: "",
					success: function(response){
						if(response && response.status=='success')
						{
								location.reload();
						}
					}
		});
            
	});
@else
	$$('#join-btn').click(function()
	{
			location.href="{{ route('home.login') }}?backurl="+location.href;
	});

@endif
var joinAC = function(){
		var buttons = [
			{
					text: '请先关注',
					label: true
			},
			{
				text: '关注本团',
				onClick: function () {
					$$('#join-btn').click();
				}
			}
		];
		myApp.actions(buttons);
};
$$('.join-ac').on('click', joinAC);

var uploader_init = false;
$$(document).on('click','input#captureFile', function(evt){
 var fileEle = this;
if ( !$$(this).hasClass('bind-evt') ) {
  ImageUploader.init({
    fileInputObj: fileEle,
    uploadVariableName : fileEle.name,
    fileUploadUrl: String('{{ route("group.upload_image2",':field') }}').replace(':field',fileEle.name),
    fileExtension:'jpg;gif;png;bmp',
    onSelect:function(event){
	  this.stopUpload = false;
      var cnt = $$('#perviewList').children('li').length;
      if(cnt > 8)
      {
		this.stopUpload = true;
      	myApp.alert('最多上传9张照片');
      	return;
      }
      myApp.showIndicator();
    },
    onFailure : function(event) {
      myApp.hideIndicator();
	  alert('错误代码'+event.errorCode);
	},
    onSuccess: function(event) {
      myApp.hideIndicator();
	 /* var na = this.uploadVariableName;
	  var obj = $$('#'+na+'_obj');
	  obj.val( event.target[0]['serverData'] );
	  $$('#'+na+'_perview').prop('src', event.target[0]['url']);
	  $$('#'+na+'_hids').append('<input type="hidden" name="'+na+'_his[]" value="'+event.target[0]['serverData']+'">');*/
	  //console.log(['uploaded',event]);
	  var htm ='<li style="display:inline-block;width:30%;margin:3px;"><img src="'+event.target[0]['thumb']+'" width="100%" fullimg="'+event.target[0]['url']+'">';
	  htm += '<input type="hidden" name="postpics[]" value="'+event.target[0]['serverData']+'">'
	  htm += '</li>';
	  $$('#perviewList').append(htm);
	  var picList = [];
	  $$('#perviewList li img').each(function(){
	  	picList.push(  $$(this).attr('fullimg') );
	  });
	  var len =  $$('#perviewList').children('li').length;
	  init_photo_browser(picList);
	  $$($$('#perviewList').children('li').eq(len-1)).click(function(){
	  	var idx = $$(this).index();
	  	myPhotoBrowser.open(idx);
	  })
	}
  });
  // ImageUploader._fileSelectEvent(evt);
  $$(this).addClass('bind-evt');
}
});
var adjustImg  = function() {
	$$('.photo-list img').on('load', function(){
		if($$(this).hasClass('lazy-loaded'))
		{
			$$(this).valignImg(80, 80);
		}
	});
}
adjustImg();

$$(document).on('click', '.btn-submit', function(){
    $$('#frm').submit();
})
</script>
@show